<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./jquery-3.4.1.js"></script>
</head>

<body>
    <button type="button" onclick="get1()">get请求不带参数</button><br>
    <button type="button" onclick="get2()">get请求带参数</button><br>
    <button type="button" onclick="post1()">post请求不带参数</button><br>
    <button type="button" onclick="post3()">post请求带参数</button><br>
    <button type="button" onclick="post4()">post请求带参数[json]</button><br>
</body>
<script>
    // get请求不带参数
    function get1() {
        // 使用jQ发送ajax请求
        // 他接受一个参数  对象
        $.ajax({
            // 请求类型
            type: "GET",
            // 请求地址
            url: "http://localhost:3000/get1",
            // 回调函数1 success 成功  res存着响应数据
            success: function (res) {
                console.log(res);
            },
            // 回调函数1 error 失败  错误
            // xhr 指的是ajax对象  xhr.status 存着响应状态码
            // errortype错误类型

            error: function (xhr, errortype) {
                console.log(xhr.status);
            }
        })
    }
    // get请求带参数
    function get2() {
        // 使用jQ发送ajax请求
        // 他接受一个参数  对象
        $.ajax({
            // 请求类型
            type: "GET",
            // 请求地址
            url: "http://localhost:3000/get2",
            // JQ传递数据非常简单不需要手动拼接，给他一个对象就行
            data:{
                username: "张凡",
                password: 123456
            },
            // 回调函数1 success 成功  res存着响应数据
            success: function (res) {
                console.log(res);
            },
            // 回调函数1 error 失败  错误
            // xhr 指的是ajax对象  xhr.status 存着响应状态码
            // errortype错误类型

            error: function (xhr, errortype) {
                console.log(xhr.status);
            }
        })
    }
</script>

</html>